<template>
  <div>
    <div class="feature">
      <span>请输入桌号</span>
      <el-input placeholder="请输入"></el-input>
      <el-button>结账</el-button>
    </div>
    <el-table :data="this.tableDatas" border style="width: 100%">
      <el-table-column prop="food_table_number" label="餐桌编号" width="350">
      </el-table-column>
      <el-table-column prop="food_name" label="菜品名称" width="180">
      </el-table-column>
      <el-table-column prop="food_price" label="菜品单价" width="150">
      </el-table-column>
      <el-table-column prop="food_count" label="份数" width="280">
      </el-table-column>
      <el-table-column prop="name" label="修改信息"> </el-table-column>
    </el-table>
  </div>
</template>

<script>
import { mapState, mapActions, mapMutations } from "vuex";
export default {
  components: {},
  name: "cashieTable",
  data() {
    return {};
  },
  mounted() {
    this.setTable();
    console.log(this.tableDatas);
  },
  methods: {
    ...mapActions("vuexs", ["setTable"]),
  },
  computed: {
    ...mapState("vuexs", ["tableDatas"]),
  },
};
</script>

<style lang="less" scoped>
.feature {
  width: 100%;
  margin-bottom: 3%;
  span {
    margin-right: 1%;
  }
  .el-input {
    width: 15%;
    margin-right: 1%;
  }
  .el-button {
    background-color: #409eff;
    color: #fff;
  }
}
</style>